
<!-- 市场服务减碳编辑业务实现-->
<template>
  <!-- 新增&修改 start-->
  <vxe-modal :modelValue="isEditFormVisible" :show-footer="true" :position="dialogPosition" :title="title" :width="dialogWidth" :height="dilogHeight" resize="" :before-hide-method="beforeCloseDialog">
    <el-form inline-message status-icon ref="dataFormRef" :rules="verify" :model="formData" label-position="right" label-width="120px" require-asterisk-position="right">
      <el-form-item label="主键" prop="id" v-show="false">
        <el-input v-model="formData.id" :readonly="isReadOnly" />
      </el-form-item>
      <el-form-item label="日期" prop="transDate">
        <el-date-picker v-model="formData.transDate" value-format="YYYY-MM-DD 00:00:00" type="date" :columnInfo="{columnName:'日期',readonly:isReadOnly}" />
      </el-form-item>
      <el-form-item label="客户编号" prop="customerCode">
        <el-input v-model="formData.customerCode" :columnInfo="{columnName:'客户编号',readonly:isReadOnly}" />
      </el-form-item>
      <el-form-item label="客户名称" prop="customerName">
        <el-input v-model="formData.customerName" :columnInfo="{columnName:'客户名称',readonly:isReadOnly}" />
      </el-form-item>
      <el-form-item label="运输箱量" prop="boxCount">
        <el-input type="number" :controls="false" v-model.number="formData.boxCount" :columnInfo="{columnName:'运输集装箱数量',readonly:isReadOnly}">
          <template #append>箱</template>
        </el-input>
      </el-form-item>
      <el-form-item label="运输方式">
        <!-- <lxsh-common-dictionary-comb v-model="formData.transType" :dictionaryCode="'TRANSFER_WAY'" :columnInfo="{columnName:'运输方式',readonly:isReadOnly}" /> -->
        <lxsh-common-comb v-model="formData.transType" :requestUrl="requestContextPath.cer + '/cer/typeGroup/getTypeGroupComboByGroup/市场服务'" :columnInfo="{columnName:'运输方式',readonly:isReadOnly}" @handleSelectChange="transTypeChange" />
      </el-form-item>
      <el-form-item label="运输出发地" prop="startPlace">
        <el-input v-model="formData.startPlace" :columnInfo="{columnName:'运输出发地',readonly:isReadOnly}" />
      </el-form-item>
      <el-form-item label="运输目的地" prop="endPlace">
        <el-input v-model="formData.endPlace" :columnInfo="{columnName:'运输目的地',readonly:isReadOnly}" />
      </el-form-item>
      <el-form-item label="运输距离" prop="transDistance">
        <el-input type="number" :controls="false" v-model.number="formData.transDistance" :columnInfo="{columnName:'运输距离',readonly:isReadOnly}">
          <template #append>公里</template>
        </el-input>
      </el-form-item>

      <el-form-item label="单箱排放量" prop="singleBoxCount">
        <el-input type="number" :controls="false" v-model.number="formData.singleBoxCount" :columnInfo="{columnName:'单箱排放量',readonly:isReadOnly}" />
      </el-form-item>
      <el-form-item label="减碳量" prop="reduceCount">
        <el-input type="number" :controls="false" v-model.number="formData.reduceCount" :columnInfo="{columnName:'减碳量',readonly:isReadOnly}" />
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="beforeCloseDialog()">取消</el-button>
      <el-button type="primary" @click="onSubmit(dataFormRef)">确定</el-button>
    </template>
  </vxe-modal>
  <!-- 新增&修改 end-->
</template>
<script lang="ts" setup>
import { requestContextPath } from 'lxsh-cer-web-pc/src/constants'
import { hooksForCommonForm } from "hhlt-vue/src/components/Lxsh/Common/hooksForCommonForm";
import { Ref, ref, toRefs } from "vue";
import { FormInstance } from "element-plus";
import {
  ICerMarketImpro,
  CerMarketImpro,
} from "lxsh-cer-web-pc/src/model/cer/cer/market-impro/cer-market-impro";
import { IPageInfo } from "hhlt-core/src/model/page/pageInfo";
interface ICommonFormProps {
  //官方暂不支持import props暂定解决方案，等后期支持后删除，issue #4294
  pageInfo: IPageInfo<ICerMarketImpro>;
  functionDistinguish: string;
  isEditFormVisible: Boolean;
}
//获取props参数
const props = defineProps<ICommonFormProps>();
//获取form实例
const dataFormRef: Ref<FormInstance | undefined> = ref<FormInstance>();
//自定义事件[本编辑界面处理完成]
const emits = defineEmits(["editProcessSuccess"]);
//hooks初始化
const {
  commonData,
  title,
  dialogPosition,
  dilogHeight,
  isReadOnly,
  beforeCloseDialog,
  onSubmit,
} = hooksForCommonForm<CerMarketImpro>(
  new CerMarketImpro(),
  dataFormRef,
  props,
  emits
);
//返回vue界面需要使用到的data
const { dialogWidth, formData, verify } = toRefs(commonData);

const transTypeChange = (el: any) => {
  console.log(el.otherInfo);
  const other = JSON.parse(el.otherInfo);
  formData.value.energyUnit = other.energyUnit;
  formData.value.coefficient = other.coefficient;
};
</script>
